<template>
	<view @tap="jumpToUserProfile" class="bg-white radius margin-top margin-bottom-sm margin-left margin-right">
		<view class="flex justify-between align-center padding" style="width: 100%;">
			<view @tap="clickAction" class="flex justify-start align-center" style="width: 100%;">
				<view class="padding-right">
					<image class="radius" :src="userInfo.avatar" style="width: 100upx;height: 100upx;">
					</image>
				</view>
				<view class="flex justify-start align-start" style="flex-direction: column;width: 100%;">
					<view class="flex justify-between align-center" style="width: 100%;">
						<view class="flex justify-start align-center">
							<text class="text-bold text-lg padding-right-xs">{{userInfo.nickname}}</text>
							<image v-if="userInfo.sex!==-1" class="sex-icon"
								:src="'../static/images/setting/'+[userInfo.sex==0?'female':'male']+'.png'"></image>
							<view v-if="userInfo.sex!==-1" class="padding-right-xs"></view>
							<view v-if="userInfo.group"
								:class="'radius cu-tag sm bg-'+[userInfo.group.open_choose==1?'gray text-grey':'blue']">
								{{userInfo.group.name}}</view>
						</view>
					</view>
					<view class="flex justify-between align-center padding-top-sm" style="width: 100%;">
						<text class="text-gray">{{userInfo.active_count}}动态 .  {{userInfo.post_count}}帖子</text>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		name: "CircleUserItem",
		data() {
			return {

			};
		},
		props: {
			userInfo: {
				type: Object,
				default: {}
			},
			lastActiveTime: {
				type: String,
				default: ''
			},
		},
		methods: {
			jumpToUserProfile() {
				uni.navigateTo({
					url: '/pages/profile/profile?userId=' + this.userInfo.user_id
				})
			},
			clickAction() {
				this.$emit('click')
			}
		},
	}
</script>

<style lang="scss">
	.sex-icon {
		width: 25upx;
		height: 25upx;
	}
</style>
